<template>
    <view class="page">
        <view class="student-info">
            <view class="basic-info">
                <view class="avator">
                    <image src="/static/nan.png"  
                        mode="aspectFit" 
                        style="width: 100rpx;height: 100rpx;"></image>
                </view>
                <view class="name">
                    <view>王泽</view>
                    <view class="phone">188****3465</view>
                </view>
                <view class="age">14岁</view>
            </view>
            <view class="basic-foot">
                <span>学校：市南区一中 </span>
                <span>班级：2015级12班</span>
            </view>
        </view>
        <view class="screen-form">
            <view class="block-10"></view>
            <view class="tab-bar">
                <view class="tab-wrapper">
                    <view @click="tabClick(1, 'spine')" class="btn" :class="{'active': curTab == 1}">脊柱</view>
                    <view @click="tabClick(2, 'foot')" class="btn" :class="{'active': curTab == 2}">足部</view>
                </view>
            </view>
            <component :is="curForm"></component>
            <view class="form-foot">
                <button type="primary" class="submit-btn">提交</button>
            </view>
        </view>
    </view>
</template>

<script>
    import spine from './components/spine.vue'
    import foot from './components/foot.vue'
    import { getStudInfo, addScreenData } from '@/api/screen.js'
    export default {
        data() {
            return {
               curForm: spine,
               curTab: 1,
               formData: {
                   studentId: undefined,
               }
            }
        },
        onLoad(e) {
            this.formData.studentId = e.studentId
            this.handleGetStuInfo()
        },
        components: {
            spine,
            foot
        },
        methods: {
            tabClick(index, tabName) {
                this.curTab = index
                this.curForm = tabName
            },
            //根据ID查询学生筛查数据
            handleGetStuInfo() {
                getStudInfo({id: this.formData.studentId}).then(res => {
                    console.log(res.data)
                })
            },
            //提交筛查数据
            handleSubmit() {
                addScreenData(this.formData).then(res => {
                    
                })
            }
        }
    }
</script>

<style lang="less">
@import url('screen.less');
</style>

